<!-- 领券中心与新人券中心公用 -->

<template>
  <view class="view">
    <view class="wrapper">
      <image src="../../static/mycoupon.svg" class="title"></image>
      <mCoupon :coupon="item.coupon" :user-coupon="item" v-for="item in coupons" :key="item.id"></mCoupon>
    </view>
  </view>
</template>

<script>
import mCoupon from '@/components/mCoupon/index'

export default {
  components: {
    mCoupon
  },

  data() {
    return {
      // coupons: [
      //   {
      //     id: 1,
      //     name: '全平台折扣券',
      //     details: '全平台可用', // 使用限制等
      //     money: 0,
      //     coupons: 0.8,
      //     limitMoney: 0,
      //     freePostage: false,
      //     validityPeriod: 1, // 有效期限按天计算
      //     points: 3000,
      //     stock: -1,
      //     category: 'coupons'
      //   },
      //   {
      //     id: 2,
      //     name: '桂味荔枝代金券',
      //     details: '限桂味荔枝',
      //     money: 100,
      //     coupons: 0,
      //     limitMoney: 0.01,
      //     freePostage: false,
      //     validityPeriod: 1, // 有效期限按天计算
      //     points: 500,
      //     stock: 3,
      //     category: 'cash'
      //   },
      //   {
      //     id: 3,
      //     name: '怀枝荔枝包邮券',
      //     details: '限怀枝荔枝',
      //     money: 0,
      //     coupons: 0,
      //     limitMoney: 0,
      //     freePostage: true,
      //     validityPeriod: 1, // 有效期限按天计算
      //     points: 200,
      //     stock: 10,
      //     category: 'shipping'
      //   },
      //   {
      //     id: 4,
      //     name: '黑叶荔枝折扣券',
      //     details: '限黑叶荔枝',
      //     money: 0,
      //     coupons: 0.8,
      //     limitMoney: 0,
      //     freePostage: false,
      //     validityPeriod: 1, // 有效期限按天计算
      //     points: 400,
      //     stock: 0,
      //     category: 'coupons'
      //   },
      //   {
      //     id: 5,
      //     name: '黑叶荔枝代金券',
      //     details: '限黑叶荔枝',
      //     money: 10,
      //     coupons: 0,
      //     limitMoney: 100,
      //     freePostage: false,
      //     validityPeriod: 1, // 有效期限按天计算
      //     points: 600,
      //     stock: 2,
      //     category: 'cash'
      //   }
      // ]

      coupons: [],
      user_id: ''
    }
  },
  onLoad() {
    this.user_id = getApp().globalData.userInfo.id
    this.getData()
  },
  methods: {
    async getData() {
      const { data: res } = await uni.request({
        url: this.$domain.data + '/getUserCouponList/' + this.user_id,
        header: getApp().globalData.header
      })
      if (res.status != 200) {
        this.$checkStatus(res.status)
        return
      }
      // console.log(res.data)
      this.coupons = res.data
    }
  }
}
</script>

<style lang="scss" scoped>
.title {
  width: 100%;
  height: 200upx;
  margin-bottom: 20upx;
}

.wrapper {
  width: 100%;
  padding: 20upx;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 20upx;
}

.exchange-btn {
  background-color: #ff5722;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100upx;
  height: 70upx;
  font-size: 30upx;
  padding: 0;
  border-radius: 10upx;
  color: #ffffff;

  cursor: pointer;
  transition: all 0.3s;

  &.disabled {
    background-color: #cccccc;
    cursor: not-allowed;
  }

  &:hover {
    opacity: 0.9;
  }
}
</style>
